<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml" xmlns:cms="">

<head th:include="include/head">

</head>
<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">
	<div class="content-wrapper">
		<!-- Content Header (Page header) -->
		<section class="content-header">
			<div class="container-fluid">
				<div class="row mb-2">
					<div class="col-sm-6">
						<h1>面试管理</h1>
					</div>
					<div class="col-sm-6">
						<ol class="breadcrumb float-sm-right">
							<li class="breadcrumb-item"><a href="#">首页</a></li>
							<li class="breadcrumb-item active">面试管理</li>
						</ol>
					</div>
				</div>
			</div>
			<!-- /.container-fluid -->
		</section>

		<!-- Main content -->
		<section class="content">
			<div class="container-fluid">
				<div class="row">
					<div class="col-md-12">
						<div class="card">
							<div class="card-header">
								<h3 class="card-title">流程列表</h3>
								<button type="button" class="btn btn-primary" id="add"
										style="float: right;">新增流程</button>
							</div>
							<div class="card-header">
								<form form id="search-form2" class="navbar-form form-inline"
									  th:action="@{/process/list}" method="post">
									<div class="form-group">
										<label>归属部门:</label>
										<select name="baseId"  class="form-control">
											<option value="" >全部基地</option>
											<option th:each="base : ${baseList}" th:value="${base.baseId}"  th:selected="${base.baseId}==${baseId}"  th:text="${base.baseName}">
										</select>
										&nbsp
										<label>名称:</label>
										<input type="text" name="name" th:value="${name}" placeholder="流程名称" class="form-control">
										<button type="submit" class="btn btn-primary">查询</button>
									</div>
								</form>
							</div>
							<!-- /.card-header -->
							<div class="card-body">
								<table class="table table-bordered">
									<thead>
									<tr>
										<th style="width: 10px">#</th>
										<th>名称</th>
										<th>创建时间</th>
										<!-- 												<th>绑定社区</th> -->
										<th>创建者</th>
										<th>归属部门</th>
										<th>流程</th>
										<th>状态</th>
										<th style="width: 180px">操作</th>
									</tr>
									</thead>
									<tbody>
									<tr th:each="bean : ${pageInfo.list}"
										th:attr="id=tr_+${bean.processId}">
										<td th:text="${bean.processId}"></td>
										<td th:text="${bean.processName}"></td>

										<!-- 												<td><cms:community uid="${bean.id}"></cms:community></td> -->
										<td><cms:time timeInt="${bean.createTime}"></cms:time></td>
										<td th:text="${bean.operName}"></td>
										<td th:text="${bean.baseName}"></td>
										<td th:text="${bean.processCount+'步'}"></td>
										<td th:id="'strs'+${bean.processId}"  th:text="${bean.processState}==1?'启用':'停用'"
											th:style="${bean.processState}==1?'color:blue':'color:red'"
										></td>

										<td>
											<a class="btn btn-info btn-sm edit"
											   th:href="'add?id='+${bean.processId}"><i
													class="fas fa-pencil-alt"></i>编辑</a> &nbsp;&nbsp;

<!--											<a class="btn btn-danger btn-sm del" href="javascript:;"-->
<!--											   th:attr="data-id=|${bean.processId}"><i class="fas fa-trash">-->
<!--											</i>禁用</a>-->
											<a href="javascript:;" th:attr="data-id=|${bean.processId}" class="btn btn-danger btn-sm del">
												<i class="fas fa-trash"></i>
												<span th:id="'str'+${bean.processId}" th:if="${bean.processState==0}">启用</span>
												<span th:id="'str'+${bean.processId}" th:if="${bean.processState==1}">停用</span>
											</a>
										</td>
									</tr>
									</tbody>
								</table>
							</div>
							<!-- /.card-body -->
							<cms:page></cms:page>
							<!-- /.card -->
						</div>

					</div>
				</div>
			</div>
		</section>
	</div>
</div>
<!-- ./wrapper -->
<div th:include="include/foot"></div>
<script>
	$().ready(function() {
		$("#add").click(function() {
			loadPage();
			location.href = 'add';
		});
		$(".edit").click(function() {
			loadPage();

		});
		$(".del").click(function() {
			let id = $(this).data('id');
			var das=$("#str"+id).text();
			if (confirm('确定'+das+'流程吗？')) {
				$.ajax({
					url : 'operation?id=' + id,
					success : function(e) {
						if (e.state==1) {
							$("#str"+id).text("启用");
							$("#strs"+id).empty();
							$("#strs"+id).append('<span style="color:red">停用</span>');
						}else{
							$("#str"+id).text("停用");
							$("#strs"+id).empty();
							$("#strs"+id).append('<span style="color:blue">启用</span>');
						}
					},error:function(e){
						layer.msg(e.responseText, {icon: 5});
					}
				});
			}

		});
	});
	loadPage=function(){
		window.parent.loadPage();
	}
</script>
</body>
</html>
